import {
  Space,
  TableColumnsType,
  Tag,
  Tooltip,
  Typography,
  Image,
  Badge,
  Input,
  message,
  InputNumber,
  Popconfirm,
  Switch,
  Select,
  Table,
  Empty,
  Dropdown,
} from 'antd'
import { NavigateFunction } from 'react-router-dom'
import type { ISkuType, ITableData } from './types'
import { DIS_STATUSBANDBTNTEXT, STATUSBAND, STATUSCONFIRMTEXT } from '@/constant'
import { getImageByUrl } from '@/utils/getImageByUrl'
import UploadButton from '@/components/UploadButton'
import { spuEditPicture } from '@/api/goods'
import { CopyOutlined, MinusSquareOutlined, PictureOutlined, PlusSquareOutlined, StopOutlined } from '@ant-design/icons'
import { importBlobImg } from '@/api'
export const useIndexColumns = ({
  navigate,
  reLoadPage,
  editSpuPicture,
  tableData,
  settableData,
}: {
  navigate: NavigateFunction
  reLoadPage: () => void
  editSpuPicture: boolean
  tableData: ITableData[]
  settableData: React.Dispatch<React.SetStateAction<ITableData[]>>
}): TableColumnsType<ITableData> => [
  {
    title: '款式图',
    dataIndex: 'mainPicFileId',
    key: 'mainPicFileId',
    align: 'center',
    width: 150,
    fixed: 'left',
    render: (info, rows) => {
      return (
        <div className="image_hover_change_wrap">
          <div className="ihcw_image">
            {rows.isEdit ? (
              <div style={{ padding: '0 40px 0 0' }}>
                <Input
                  placeholder="粘贴图片到这里"
                  style={{ border: 'none', outline: 'none', boxShadow: 'none', borderRadius: 'none' }}
                  autoFocus
                  onPaste={async (event: any) => {
                    const items = (event.clipboardData || event.originalEvent.clipboardData).items
                    let hasImage = false
                    for (const item of items) {
                      if (item.type.indexOf('image') === 0) {
                        hasImage = true
                        const blob = item.getAsFile()
                        if (blob.size > 1024 * 1024 * 10) {
                          message.warning('图片大小不能超过10MB！')
                          return
                        }
                        const imgdata = await importBlobImg(blob)
                        if (imgdata.code === 200 && imgdata.data?.linkUrl) {
                          const paramsData = {
                            spuId: rows?.spuId || '',
                            spuCode: rows?.spuCode,
                            mainPicFileId: imgdata.data?.linkUrl,
                          }
                          const res = await spuEditPicture(paramsData)
                          if (res.code === 200) {
                            message.success('操作成功')
                            reLoadPage()
                          }
                        }
                      }
                    }
                    if (!hasImage) {
                      message.warning('上传失败，粘贴内容不是图片！')
                      rows.isEdit = !rows.isEdit
                      settableData([...tableData])
                    }
                  }}
                ></Input>
              </div>
            ) : (
              <Image
                rootClassName="table_image"
                width={50}
                height={50}
                src={info}
                fallback={getImageByUrl('moren.png')}
              />
            )}
          </div>
          {editSpuPicture && (
            <div className="fly_btn_upload">
              <Tooltip title={rows.isEdit ? '取消' : '图片替换'}>
                <div
                  onClick={() => {
                    rows.isEdit = !rows.isEdit
                    settableData([...tableData])
                  }}
                >
                  {rows.isEdit ? <StopOutlined /> : <PictureOutlined />}
                </div>
              </Tooltip>
            </div>
          )}
        </div>
      )
    },
  },
  {
    title: '款式编码',
    dataIndex: 'spuCode',
    key: 'spuCode',
    align: 'center',
    width: 120,
    ellipsis: {
      showTitle: false,
    },
    render: (info, rows) => {
      return info ? (
        <Tooltip
          placement="top"
          color="#fff"
          overlayInnerStyle={{ width: 550 }}
          title={
            <div className="small_sise_customtable">
              <Table
                bordered
                pagination={false}
                rowHoverable={false}
                rowKey={(rows) => rows.skuCode}
                dataSource={rows?.skuInfoVOS || []}
                columns={[
                  {
                    title: (
                      <div style={{ display: 'flex', alignItems: 'center', gap: 6, justifyContent: 'center' }}>
                        <span>商品条码</span>
                        <Typography.Text
                          copyable={{
                            onCopy: async () => {
                              const skuCodes = rows?.skuInfoVOS?.map((item) => item.skuCode).join('\r\n') || ''
                              try {
                                await navigator.clipboard.writeText(skuCodes)
                              } catch (error) {
                                console.error('复制失败:浏览器不支持 navigator.clipboard.writeText方法', error)
                              }
                            },
                          }}
                        ></Typography.Text>
                      </div>
                    ),
                    dataIndex: 'skuCode',
                    key: 'skuCode',
                    align: 'center',
                    render: (info) => (info ? info : '-'),
                  },
                  {
                    title: '颜色编码',
                    dataIndex: 'colorCode',
                    key: 'colorCode',
                    align: 'center',
                    render: (info) => (info ? info : '-'),
                  },
                  {
                    title: '颜色名称',
                    dataIndex: 'colorDetailName',
                    key: 'colorDetailName',
                    align: 'center',
                    render: (info) => (info ? info : '-'),
                  },
                  {
                    title: '尺码',
                    dataIndex: 'sizeInfo',
                    key: 'sizeInfo',
                    align: 'center',
                    render: (info) => (info ? info : '-'),
                  },
                ]}
                scroll={{
                  y: 300,
                }}
              ></Table>
            </div>
          }
        >
          <Typography.Link
            onClick={() => {
              navigate('/goods/manage/detail?spuId=' + rows.spuId)
            }}
          >
            {info}
          </Typography.Link>
        </Tooltip>
      ) : (
        '-'
      )
    },
  },
  {
    title: '助记码',
    dataIndex: 'designCode',
    key: 'designCode',
    align: 'center',
    width: 120,
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '款式名称',
    dataIndex: 'spuName',
    key: 'spuName',
    align: 'center',
    width: 250,
    ellipsis: {
      showTitle: false,
    },
    render: (info, rows, index) => {
      return (
        <Tooltip placement="top" title={info}>
          <Typography.Link
            ellipsis
            onClick={() => {
              navigate('/goods/manage/detail?spuId=' + rows.spuId)
            }}
            style={{ paddingLeft: 12, paddingRight: 12 }}
          >
            {info}
          </Typography.Link>
        </Tooltip>
      )
    },
  },
  {
    title: '款式分类',
    dataIndex: 'className',
    key: 'className',
    align: 'center',
    width: 250,
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return (
        <Tooltip placement="top" title={info}>
          {info || '-'}
        </Tooltip>
      )
    },
  },
  {
    title: '推送状态',
    dataIndex: 'pushErrorMsg',
    key: 'pushErrorMsg',
    align: 'center',
    width: 150,
    render: (info) => {
      return info ? (
        <Tooltip placement="top" title={info}>
          <Tag color="error">推送CB失败</Tag>
        </Tooltip>
      ) : (
        '-'
      )
    },
  },
  {
    title: '商品系列',
    dataIndex: 'productSeries',
    key: 'productSeries',
    align: 'center',
    width: 140,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '采购方式',
    dataIndex: 'purchaseTypeName',
    key: 'purchaseTypeName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '主供应商',
    dataIndex: 'mainSupplierName',
    key: 'mainSupplierName',
    align: 'center',
    width: 180,
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return (
        <Tooltip placement="top" title={info}>
          {info || '-'}
        </Tooltip>
      )
    },
  },
  {
    title: '商品企划编号',
    dataIndex: 'planNo',
    key: 'planNo',
    align: 'center',
    width: 150,
    render: (info, rows) => {
      return info ? (
        <Typography.Link onClick={() => navigate('/goods/plan/detail?planingId=' + rows.planingId)}>
          {info}
        </Typography.Link>
      ) : (
        '-'
      )
    },
  },
  {
    title: '吊牌价',
    dataIndex: 'originSalePrice',
    key: 'originSalePrice',
    align: 'center',
    width: 120,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '年份',
    dataIndex: 'year',
    key: 'year',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '适销季节',
    dataIndex: 'seasonName',
    key: 'seasonName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '上市日期',
    dataIndex: 'releaseSeasonDate',
    key: 'releaseSeasonDate',
    align: 'center',
    width: 130,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '过季日期',
    dataIndex: 'overSeasonDate',
    key: 'overSeasonDate',
    align: 'center',
    width: 130,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '适销年龄段',
    dataIndex: 'suitAgeGroupName',
    key: 'suitAgeGroupName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '商品等级',
    dataIndex: 'productLevelName',
    key: 'productLevelName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '价格属性',
    dataIndex: 'pricePropertyName',
    key: 'pricePropertyName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '定价权限',
    dataIndex: 'priceAuthName',
    key: 'priceAuthName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '季节分组',
    dataIndex: 'seasonGroupName',
    key: 'seasonGroupName',
    align: 'center',
    width: 100,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '状态',
    dataIndex: 'enableStatus',
    key: 'enableStatus',
    align: 'center',
    width: 110,
    render: (info) => {
      return <Badge status={info == 1 ? 'success' : 'error'} text={STATUSBAND[info] || '-'} />
    },
  },
]

export const useFabricDel = ({
  isEdit,
  FabricList: tableData,
  setFabricList: settableData,
  FabricOption,
  handleSearchFabric,
  SupplierOption,
  handleSearchSupplier,
  detailInfo,
  inputRef,
}: {
  isEdit: boolean
  FabricList: any[]
  setFabricList: React.Dispatch<React.SetStateAction<any[]>>
  FabricOption: IOptionItem[]
  handleSearchFabric: (
    newVal: string,
    devSeason?: number,
    bigClassId?: number[] | string,
    intensiveStatus?: 0 | 1,
  ) => void
  SupplierOption: IOptionItem[]
  handleSearchSupplier: (newVal: string) => void
  detailInfo: Record<string, any>
  inputRef: React.MutableRefObject<any>
}): TableColumnsType<any> => [
  {
    title: '操作',
    dataIndex: 'cz',
    key: 'cz',
    align: 'center',
    width: 80,
    render: (_, __, index) => {
      return (
        <Space
          size="small"
          style={{
            visibility: isEdit ? 'visible' : 'hidden',
          }}
        >
          {tableData.length > 1 && (
            <Typography.Link>
              <MinusSquareOutlined
                style={{ color: 'var(--error-color)' }}
                onClick={() => {
                  console.log('删除操作')
                  tableData.splice(index, 1)
                  settableData([...tableData])
                }}
              />
            </Typography.Link>
          )}
          {index === tableData.length - 1 && (
            <Dropdown
              onOpenChange={(show) => {
                setTimeout(() => {
                  show && inputRef.current?.focus()
                }, 400)
              }}
              menu={{
                items: [
                  {
                    key: 'addbtn',
                    label: (
                      <div
                        className="spec_input_drop_down"
                        style={{ display: 'flex', alignItems: 'center', gap: 6 }}
                        onClick={() => {
                          const val = inputRef?.current?.input?.value || 1
                          for (let index = 1; index <= val; index++) {
                            tableData.push({
                              tempId: index + new Date().getTime(),
                              isEdit: true,
                            })
                          }
                          settableData([...tableData])
                        }}
                      >
                        添加
                        <Input
                          ref={inputRef}
                          className="spec_input_drop_down"
                          style={{ width: 60, lineHeight: 0, height: 24 }}
                          defaultValue={1}
                          onClick={(event) => {
                            event.stopPropagation()
                          }}
                          onPressEnter={(event: any) => {
                            const val = event?.target?.value
                            for (let index = 1; index <= val; index++) {
                              tableData.push({
                                tempId: index + new Date().getTime(),
                                isEdit: true,
                              })
                            }
                            settableData([...tableData])
                          }}
                        ></Input>
                        行
                      </div>
                    ),
                  },
                ],
              }}
            >
              <Typography.Link>
                <PlusSquareOutlined />
              </Typography.Link>
            </Dropdown>
          )}
        </Space>
      )
    },
  },
  {
    title: '是否集约',
    dataIndex: 'intensiveStatus',
    key: 'intensiveStatus',
    align: 'center',
    width: 100,
    render: (info, rows) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Select
            value={info}
            options={[
              { label: '是', value: 1 },
              { label: '否', value: 0 },
            ]}
            onChange={(val) => {
              rows.intensiveStatus = val
              rows.materialsCode = null
              rows.fabricName = null
              settableData([...tableData])
            }}
          ></Select>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{STATUSCONFIRMTEXT[info] || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '使用部位',
    dataIndex: 'useSite',
    key: 'useSite',
    align: 'center',
    width: 80,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Input
            value={info || null}
            status={!rows.useSite ? 'error' : undefined}
            onChange={(event) => {
              rows.useSite = event.target.value
              settableData([...tableData])
            }}
          ></Input>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '面料名称',
    dataIndex: 'fabricName',
    key: 'fabricName',
    align: 'center',
    width: 180,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          {rows.intensiveStatus ? (
            <Select
              status={!rows.fabricName ? 'error' : undefined}
              onSearch={(newVal) => {
                handleSearchFabric(
                  newVal,
                  detailInfo?.purchaseType === 1 ? '@' : detailInfo?.devSeasonName,
                  detailInfo?.bigClassId,
                  1,
                )
              }}
              onChange={(_, item: any) => {
                rows.fabricName = item?.label
                if (rows.intensiveStatus == 1) {
                  rows.materialsCode = item?.code
                  rows.fabricSupplier = item?.supplierNames
                  rows.fabricSpec = item?.yarnSpec
                  rows.fabricComposition = item?.fabricComposition
                  rows.fabricBreadth = item?.fabricBreadth
                  rows.gramWeight = item?.gramWeight
                }
                settableData([...tableData])
              }}
              value={info || null}
              options={FabricOption}
              popupMatchSelectWidth={false}
              suffixIcon={null}
              showSearch={true}
              filterOption={false}
              optionFilterProp="label"
              notFoundContent={<Empty description="请输入内容搜索" image={Empty.PRESENTED_IMAGE_SIMPLE} />}
            ></Select>
          ) : (
            <Input
              value={info || null}
              status={!rows.fabricName ? 'error' : undefined}
              onChange={(event) => {
                rows.fabricName = event.target.value
                settableData([...tableData])
              }}
            ></Input>
          )}
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <div className="fabric_circle">
            <span>{info}</span>
            {index === 0 && <span className="fabric_circle_text">主</span>}
          </div>
        </div>
      )
    },
  },
  {
    title: '面料供应商',
    dataIndex: 'fabricSupplier',
    key: 'fabricSupplier',
    align: 'center',
    width: 180,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          {rows.intensiveStatus ? (
            <Select
              value={info || null}
              onSearch={(newVal) => {
                handleSearchSupplier(newVal)
              }}
              onChange={(_, item: any) => {
                rows.fabricSupplier = item?.label
                settableData([...tableData])
              }}
              status={rows?.intensiveStatus == 1 && !rows.fabricSupplier ? 'error' : undefined}
              options={SupplierOption}
              popupMatchSelectWidth={false}
              suffixIcon={null}
              showSearch={true}
              filterOption={false}
              optionFilterProp="label"
              notFoundContent={<Empty description="请输入内容搜索" image={Empty.PRESENTED_IMAGE_SIMPLE} />}
            ></Select>
          ) : (
            <Input
              value={info || null}
              status={rows?.intensiveStatus == 1 && !rows.fabricSupplier ? 'error' : undefined}
              onChange={(event) => {
                rows.fabricSupplier = event.target.value
                settableData([...tableData])
              }}
            ></Input>
          )}
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '规格',
    dataIndex: 'fabricSpec',
    key: 'fabricSpec',
    align: 'center',
    width: 100,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Input
            value={info || null}
            onChange={(event) => {
              rows.fabricSpec = event.target.value
              settableData([...tableData])
            }}
            status={rows?.intensiveStatus == 1 && !rows.fabricSpec ? 'error' : undefined}
          ></Input>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '成分',
    dataIndex: 'fabricComposition',
    key: 'fabricComposition',
    align: 'center',
    width: 140,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Input
            value={info || null}
            onChange={(event) => {
              rows.fabricComposition = event.target.value
              settableData([...tableData])
            }}
            status={rows?.intensiveStatus == 1 && !rows.fabricComposition ? 'error' : undefined}
          ></Input>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '幅宽（cm）',
    dataIndex: 'fabricBreadth',
    key: 'fabricBreadth',
    align: 'center',
    width: 100,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Input
            value={info || null}
            onChange={(event) => {
              rows.fabricBreadth = event.target.value
              settableData([...tableData])
            }}
            status={rows?.intensiveStatus == 1 && !rows.fabricBreadth ? 'error' : undefined}
          ></Input>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
  {
    title: '克重（g/m²）',
    dataIndex: 'gramWeight',
    key: 'gramWeight',
    align: 'center',
    width: 100,
    render: (info, rows, index) => {
      return isEdit ? (
        <div className="form_element_wrap">
          <Input
            value={info || null}
            onChange={(event) => {
              rows.gramWeight = event.target.value
              settableData([...tableData])
            }}
            status={rows?.intensiveStatus == 1 && !rows.gramWeight ? 'error' : undefined}
          ></Input>
        </div>
      ) : (
        <div
          className="title_bgc_normal"
          onClick={() => {
            settableData([...tableData])
          }}
        >
          <span>{info || '-'}</span>
        </div>
      )
    },
  },
]

export const useColorDel = ({
  isEdit,
  skuInfoList,
  setskuInfoList,
  onStatus,
  isStatusBtnCode,
  isLoading,
}: {
  isEdit: boolean
  skuInfoList: ISkuType[]
  setskuInfoList: React.Dispatch<React.SetStateAction<ISkuType[]>>
  onStatus: (info: ISkuType, index: number) => void
  isStatusBtnCode: boolean
  isLoading: boolean
}): TableColumnsType<ISkuType> => [
  {
    width: 100,
    title: '序号',
    align: 'center',
    key: 'index',
    render: (_, __, index) => {
      return index + 1
    },
  },
  {
    width: 180,
    title: '商品条码',
    dataIndex: 'skuCode',
    key: 'skuCode',
    align: 'center',
    render: (info) => {
      return info || '-'
    },
  },
  {
    width: 100,
    title: '颜色编码',
    dataIndex: 'colorCode',
    key: 'colorCode',
    align: 'center',
    render: (info) => {
      return info || '-'
    },
  },
  {
    width: 100,
    title: '颜色名称',
    dataIndex: 'colorDetailName',
    key: 'colorDetailName',
    align: 'center',
    render: (info) => {
      return info || '-'
    },
  },
  {
    width: 100,
    title: '主辅色',
    dataIndex: 'colorType',
    key: 'colorType',
    align: 'center',
    render: (_, rows) => {
      return isEdit ? (
        <Select
          allowClear
          style={{ width: '100%' }}
          options={[
            { label: '主色', value: 0 },
            { label: '辅色', value: 1 },
          ]}
          value={rows.colorType}
          onChange={(val) => {
            const newSkuInfoList = skuInfoList.map((item) => {
              if (item.colorCode == rows.colorCode) {
                return {
                  ...item,
                  colorType: val,
                }
              } else {
                return item
              }
            })
            setskuInfoList([...newSkuInfoList])
          }}
        ></Select>
      ) : rows?.colorType == 0 ? (
        '主色'
      ) : rows?.colorType == 1 ? (
        '辅色'
      ) : (
        '-'
      )
    },
  },
  {
    width: 80,
    title: '尺码',
    dataIndex: 'sizeInfo',
    key: 'sizeInfo',
    align: 'center',
    render: (info) => {
      return info || '-'
    },
  },
  {
    width: 120,
    title: '净重（kg）',
    dataIndex: 'netWeight',
    key: 'netWeight',
    align: 'center',
    render: (info, rows, index) => {
      return rows.isEdit ? (
        <InputNumber
          precision={4}
          min={0}
          value={rows?.netWeight || 0}
          onChange={(event: any) => {
            if (isEdit) {
              // if (event >= 0 && rows?.grossWeight != null && event > rows?.grossWeight) {
              //   message.warning('净重不能大于毛重！')
              //   rows.netWeight = null
              //   setskuInfoList([...skuInfoList])
              //   return
              // }
              rows.netWeight = event
              setskuInfoList([...skuInfoList])
            }
          }}
        ></InputNumber>
      ) : (
        <div
          className={isEdit ? 'edit_intable_style disabled_in_table' : 'edit_intable_style'}
          onClick={() => {
            if (isEdit) {
              rows['isEdit'] = true
              setskuInfoList([...skuInfoList])
            }
          }}
        >
          {info || '-'}
        </div>
      )
    },
  },
  {
    width: 120,
    title: '毛重（kg）',
    dataIndex: 'grossWeight',
    key: 'grossWeight',
    align: 'center',
    render: (info, rows, index) => {
      return rows.isEdit ? (
        <InputNumber
          precision={4}
          min={0}
          value={rows?.grossWeight || 0}
          onChange={(event: any) => {
            if (isEdit) {
              // if (event >= 0 && rows?.netWeight != null && event < rows?.netWeight) {
              //   message.warning('毛重不能小于净重！')
              //   rows.grossWeight = null
              //   setskuInfoList([...skuInfoList])
              //   return
              // }
              rows.grossWeight = event
              setskuInfoList([...skuInfoList])
            }
          }}
        ></InputNumber>
      ) : (
        <div
          className={isEdit ? 'edit_intable_style disabled_in_table' : 'edit_intable_style'}
          onClick={() => {
            if (isEdit) {
              rows['isEdit'] = true
              setskuInfoList([...skuInfoList])
            }
          }}
        >
          {info || '-'}
        </div>
      )
    },
  },
  {
    width: 150,
    title: '延续款',
    dataIndex: 'carryOverCode',
    key: 'carryOverCode',
    align: 'center',
    render: (info, rows, index) => {
      return rows.isEdit ? (
        <Input
          value={rows?.carryOverCode || ''}
          onBlur={(event: any) => {
            if (isEdit) {
              rows.carryOverCode = event.target.value
              setskuInfoList([...skuInfoList])
            }
          }}
        ></Input>
      ) : (
        <div
          className={isEdit ? 'edit_intable_style disabled_in_table' : 'edit_intable_style'}
          onClick={() => {
            if (isEdit) {
              rows['isEdit'] = true
              setskuInfoList([...skuInfoList])
              console.log(rows, index, 'info')
            }
          }}
        >
          {info || '-'}
        </div>
      )
    },
  },
  {
    width: 150,
    title: '图片',
    dataIndex: 'picUrl',
    key: 'picUrl',
    align: 'center',
    render: (info, rows) => {
      return info ? (
        <img style={{ width: 30, height: 30 }} src={info} />
      ) : rows?.rgbValue ? (
        <span
          style={{
            width: 30,
            height: 30,
            display: 'inline-block',
            verticalAlign: 'middle',
            backgroundColor: `rgb${rows?.rgbValue}`,
          }}
        ></span>
      ) : (
        '-'
      )
    },
  },
  {
    title: '状态',
    align: 'center',
    width: 150,
    fixed: 'right',
    render: (_, rows, index) => {
      return (
        <Space size={'large'}>
          {isEdit && rows?.skuId && isStatusBtnCode ? (
            <Switch
              disabled={isLoading}
              value={!!rows?.enableStatus}
              checkedChildren="启用"
              unCheckedChildren="停用"
              onChange={() => onStatus(rows, index)}
            />
          ) : (
            <Badge
              status={rows?.enableStatus == 1 ? 'success' : 'error'}
              text={STATUSBAND[rows.enableStatus || 0] || '-'}
            />
          )}
        </Space>
      )
    },
  },
]
